<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			 <h1>第02节--vue模版语法</h1>
			 <h1>数据message是--{{message}}</h1>
             <h1 v-once>数据message(使用v-once指令，数据更新时插值内容不会改变)是--{{message}}</h1>
             <hr />
             <div>不使用v-html指令，数据rawHtml被解释为普通文本--{{rawHtml}}</div>
             <div>使用v-html，数据rawHtml被解释为html--<span v-html="rawHtml"></span></div>
             <hr />
             <div v-bind:id="id">Mustache 语法(双大括号)不能作用在 HTML特性上，需要使用v-bind指令绑定HTML特性</div>
             <hr />
             <div>如果 isButtonDisabled 的值是 null、undefined 或 false，则 disabled 特性甚至不会被包含在渲染出来的 button元素中</div>
             <button v-bind:disabled="isButtonDisabled">Button</button>
             <hr />
             <h1>数据绑定支持JavaScript表达式--{{message +'加hello'}}</h1>
             <h1>数据绑定限制，只能包含单个表达式，语句不能使用，流控制也不会生效</h1>
             <hr />
             <h1>vue指令--如v-if，v-for，v-bind，v-on</h1>
             <h1>vue指令参数--在指令名称之后以冒号表示，如v-bind:href,v-on:click</h1>
             <h1>vue指令修饰符--是以半角句号 . 指明的特殊后缀，如v-on:submit.prevent</h1>
             <h1>vue指令简写--v-bind简写为:，如:href；v-on简写为@,如@click</h1>
             <hr />
		</div>
	</body>
</html>
